<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="include :: header"></head>
<style>
.divSpan {
	display: inline-block;
	width: 100%;
	height: 100%;
}

.divSpan span {
	display: block;
}

 .layui-table-cell {
	height: auto;
	line-height: 25px;
} 
</style>
<body>
	<div class="layui-fluid">
		<div class="layui-card">
			<div class="layui-form layui-card-header layuiadmin-card-header-auto" id="searchForm">
			   <div class="layui-form-item">


                 <div class="layui-inline">
				  <label class="layui-form-label">内容地址</label>
				  <div class="layui-input-block">
				  <input type="text" name="url" placeholder="请输入" autocomplete="off" class="layui-input">
				   </div>
				 </div>

                 <div class="layui-inline">
				  <label class="layui-form-label">状态</label>
				  <div class="layui-input-block">
				  <input type="text" name="status" placeholder="请输入" autocomplete="off" class="layui-input">
				   </div>
				 </div>

				 <div class="layui-inline">
				  <button class="layui-btn layuiadmin-btn-sm" lay-submit
							lay-filter="searchSubmit"  >查询</button>
				</div>
				</div>
			</div>
			<div class="layui-card-body">
				<table id="dataList" lay-filter="dataList" ></table>
				
	
			</div>
		</div>
	</div>
	<link rel="stylesheet"    th:href="@{/css/common/loader.css}" media="all"/>
<link rel="stylesheet"    th:href="@{/css/common/tablepage.css}" media="all"/>
<div type="text/html" id="trTool" style="display:none">
    <a  shiro:hasPermission="business:scollImage:edit" class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
    <a  shiro:hasPermission="business:scollImage:remove" class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
</div>

<div type="text/html" id="toolbar" style="display:none" >
     <button shiro:hasPermission="business:scollImage:add"   class="layui-btn layui-btn-sm" lay-event="add"> <i class="layui-icon layui-icon-add-1"></i>新增</button>
</div>

  <script type="text/html" id="imgTpl"> 
    {{#  if(d.imageName!=null){ }}
    <img style="display: inline-block; width: 100%; height: 100%;" src={{d.imageName}}>
    {{#  } }}
   </script>  
<div th:include="include :: footer"></div>
	<script>
		layui.config({
			base :  cxt+'layuiadmin/' //静态资源所在路径
		}).extend({
			webplus : 'lib/webplus'//主入口模块
			
		}).use([ 'table','form','webplus' ], function() {
			var $ = layui.$,
			webplus=layui.webplus,
			form = layui.form,
			table = layui.table;
		   var cols= [ [ {
				type : 'numbers',
				title : '序号'
			}, {
				field : 'imageId',
				title : '编号',
				hide : true 
			},
            {
			 field : 'imageName',
			 title : '图片',
			 templet:'#imgTpl',
			 width : 200
			},
            {
			 field : 'url',
			 title : '内容地址',
			 width:250
			},
            {
			 field : 'status_dict',
			 title : '状态',
			 width:100
			},
			{
				 field : 'sortNo',
				 title : '排序号',
				 width:90
			},
            {
			 field : 'remark',
			 title : '备注',
			 width:200
			},
            {
			 field : 'createTime',
			 title : '创建时间',
			 width:180
			},
       {

				title : '操作',
				toolbar : '#trTool',
				fixed: 'right',
				width :150
			} ] ];
		   webplus.init('business/scollImage/list',cols)
			 //监听行工具事件
			  table.on('tool(dataList)', function(rowObj){
			    switch(rowObj.event){
			    	case 'edit':
			    		webplus.openEditWindow('business/scollImage/edit','编辑',rowObj,'imageId','','700','560');
			       		
			   			break;
			    	case 'del':
				    	
				        webplus.removeRow('business/scollImage/remove',rowObj,'imageId');
			    		break;
			    }
			  });
			 //监听表头按钮事件
			  table.on('toolbar(dataList)', function(obj){
			    switch(obj.event){
			      	case 'add':
				         //打开添加弹出框
				         webplus.openWindow('business/scollImage/add','新增','700','560');
			     	     break;
			    }
			  });

		});
	</script>

</body>
</html>